<script>
import MescrollBody from "../../uni_modules/mescroll-uni/components/mescroll-body/mescroll-body.vue";
import MescrollMixin from "../../uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins";
import e from "../../res/www.a9a.cn";

var app = getApp();
export default {
  name: "emotion",
  mixins: [MescrollMixin], // 使用mixin
  components: {MescrollBody},
  data() {
    return {
      currentItem: [],
      backtop_flag_index: false, // 回到顶部
      color: '',
      rgbcolor: '',
      upOption: {
        page: {
          num: 0, //当前页 默认0,回调之前会加1; 即callback(page)会从1开始
          size: 8 //每页数据条数,默认10
        },
        textNoMore: '已全部加载完毕',
        toTop: {
          use: false, // 核心配置：禁用返回顶部按钮
          src: '', // 清空图标路径（可选，避免默认图标加载）
        },
        lazyLoad: {
          use: true,
        }
      },
    }
  },
  onLoad() {
    const that = this;
    app.globalData.get_config('_ZEAI').then(function (a) {
      that.setData({
        color: app.globalData._ZEAI.color,
        rgbcolor: e.c16_rgb(app.globalData._ZEAI.color),
      });
    });
  },
  onPageScroll: function (a) {
    a.scrollTop > 100
        ? this.setData({
          backtop_flag_index: true
        })
        : this.setData({
          backtop_flag_index: false,
        });
  },
  methods: {
    // 列表调用
    downCallback(mescroll) {
      mescroll.endSuccess();
      mescroll.resetUpScroll();
    },
    upCallback(mescroll) {
      this.init(mescroll)
    },
    // 获取数据
    init(mescroll) {
      const that = this;
      const data = {
        submitok: 'renqi',
        openid: uni.getStorageSync('COOK_U').openid,
        id: 0,
        p: mescroll.num,
      };
      app.globalData.ajax({
        url: '/renqi.php',
        data: data,
        success: function (a) {
          if ('1' === a.flag) {
            if (mescroll.num === 1) {
              that.currentItem = a.LIST;
            } else {
              that.currentItem = that.currentItem.concat(a.LIST);
            }
            mescroll.endSuccess(a.LIST.length, a.LIST.length >= mescroll
                .size);

          } else {
            uni.showToast({
              title: a.msg,
              icon: 'none',
              mask: true
            });
          }
          uni.hideLoading();
        }
      });
    },
    // 回到顶部
    backtopFn: function (a) {
      this.mescroll.scrollTo(0, 300); // 300ms内平滑滚动到顶部
    },
  }
}
</script>

<template>
  <view class="emotion">
    <view class="topImg">
      <image mode="widthFix" src="https://www.youfenglove.com/up/p/form/2024/09/1_1727372244etn.jpg"></image>
    </view>
    <mescroll-body ref="mescrollRef" :up="upOption" @down="downCallback" @init="mescrollInit" @up="upCallback">
      <view class="emotionList">
        <!--        <view v-for="(brokerObj,index) in currentItem" class="emotionList">-->
        <!--        </view>-->
        <view class="emotionItem">
          <view class="emotionBox">
            <view class="emotionLeft">
              <view class="nickname">
                <text>昵称</text>
                <image class="sex" mode="widthFix"
                       src="https://www.youfenglove.com/up/p/img/grade11.png?1762504977"></image>
              </view>
              <view class="type">公益经纪人</view>
              <view class="address">
                <text class="alyIcon-dizhiguanli"></text>
                <text>湖南长沙</text>
              </view>
              <view class="address">
                <text class="alyIcon-dianhua"></text>
                <text>15263526352</text>
              </view>
              <view class="Introduction">简介：这是一段介绍</view>
            </view>
            <view class="emotionRight">
              <image class="emotionRightImg" mode="widthFix"
                     src="https://www.youfenglove.com/up/p/form/2024/09/1_1727372244etn.jpg"></image>
            </view>
          </view>
          <view class="emotionButton">
            <view class="emotionButtonLeft"></view>
            <view class="emotionButtonRight"></view>
          </view>
        </view>
      </view>
    </mescroll-body>
    <view v-if="backtop_flag_index" :style="'color:' + color" class="backtop fadeInUp" data-id="index" @tap="backtopFn">
      <text class="ico icon-backtop"></text>
      顶部
    </view>
  </view>
</template>

<style lang="scss" scoped>
@import "emotion.scss";
</style>